<template>
    <el-container class="container">
        <el-main class="container-main">
            <SpaceHeader />
            <el-container class="main-container">
                <Aside></Aside>
                <el-main class="main">
                    <RouterView />
                </el-main>
            </el-container>
        </el-main>
    </el-container>
</template>

<script setup>
import SpaceHeader from '@/components/Header/Space/index.vue'
import Aside from '@/components/Aside/index.vue'
</script>

<style scoped>
.container {
    padding: 50px;
    width: 100%;
    height: 100vh;
    background-image: url('../../assets/img/slide2.jpg');
}

.container-main {
    background-color: #f6f6f691;
    border-radius: 8px;
    box-shadow: 0 2px 10px #ccc;
}

.main-container {
    width: 100%;
    height: calc(100% - 140px);
}

.main {
    margin-left: 20px;
    background-color: #ffffff9a;
    border-radius: 8px;
}
</style>